<template>
  <div class="playpage">
    <button @click="$parent.showPlayBar = true">V</button>

    <hr />
    <button v-if="isFaved">移除收藏</button>
    <button v-else @click="$store.commit('addFav', { id: currentSong.id })">
      加入收藏
    </button>
  </div>
</template>

<script>
import { mapState } from "vuex";
export default {
  computed: {
    ...mapState(["currentSong", "currentTime", "duration", "playing", "fav"]),
    isFaved: function () {
      return this.fav.includes(this.currentSong.id);
    },
  },
};
</script>

<style lang="less">
.playpage {
  width: 100vw;
  height: 100vh;
  background: lightcoral;
  position: fixed;
  top: 0;
  left: 0;
}
</style>